<template>
	<view class="wrap">
		<view class="notice">
			<u-notice-bar mode="horizontal" :list="list" type="none" :color="colors"></u-notice-bar>
		</view>
		<view class="scanBook" v-if="scanBook.length">
			<view class="content" v-for="(item,index) in scanBook" :key="item._id" @click="toBookDetail(item._id)">
				<view class="left">
					<text style="color:#FA7298; padding: 0 20rpx;">NO{{index+1}}</text>
					<text class="bookname">{{item.bookname}}</text>
				</view>
				<view class="right">
					<text> {{$u.timeFormat(item.createTime, 'yyyy年mm月dd日 hh:MM')}}</text>
				</view>
			</view>
		</view>
		<u-empty text="暂无我的扫书" mode="favor" v-else></u-empty>
	</view>
</template>

<script>
	import * as cloudApi from '@/utils/cloudApi.js'
	export default {
		data() {
			return {
				list: ["只能删除发布吐槽的帖子，其余类型帖子请联系管理员删除"],
				userInfo: {},
				colors: null,
				scanBook: []
			}
		},
		onReady() {
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.colors
			})
		},
		onLoad() {
			this.userInfo = uni.getStorageSync("userInfo") || getApp().globalData.userInfo
			this.token = uni.getStorageSync("token") || getApp().globalData.token
			this.colors = this.userInfo.themeColors || '#F3C301'
			this.getMyScanBook()
		},
		methods: {
			toBookDetail(id) {
				uni.navigateTo({
					url: '/subpages/myScanBook/detail?_id=' + id
				})
			},
			getMyScanBook() {
				cloudApi.call({
					name: 'book',
					data: {
						api: 'getMyScanBook',
						token: this.token
					},
					success: res => {
						console.log(res);
						this.scanBook = res.result.data
					}
				})
			}
		},

	}
</script>

<style lang="scss">
	.wrap {
		.notice {
			width: 100%;
			height: 80rpx;
		}

		.scanBook {
			margin: 20rpx;

			.content {
				display: flex;
				justify-content: space-between;
				font-size: 24rpx;
				padding: 30rpx 0;

				.left {
					max-width: 350rpx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;

				}

				.right {
					color: #ccc;
					font-size: 20rpx;
				}
			}
		}
	}
</style>
